<template>
    <div style="width: 100%; height: 240px;">
        <div style="width: 90%; height: 380px;margin-left: 10px;" ref="mychart"></div>
    </div>
</template>

<script>
  import * as echarts from 'echarts';
export default {

    props:{
        dataList:[
        { value: 448, name: '不满意' },
        { value: 735, name: '一般' },
        { value: 580, name: '满意' },
                        
        ]
    },
    data() {
        return {
            currentIndex:0,
            serData:this.dataList,
            option : {
            color: ['#065aab', '#0679bc', '#06a0ab'],
            title: {
                text: '用户反馈表',
                top:'20',
                left: 'center',
                textStyle: {
                            color: '#fff',  // 设置标题文字颜色为蓝色
                            fontSize: 14,    // 设置标题文字大小为18px
                            fontWeight: 'bold'  // 设置标题文字加粗
                        }
            },
            label: {
        show: true,
        position: 'outside',
        formatter: '{b}: {d}%',
        color:'#fff',
        fontFmaily:'微软雅黑'
      },
            tooltip: {
                trigger: 'item'
            },
            legend: {
                orient: 'vertical',
                    top: '5%',
                    right: '0',
                    textStyle: {
                        color: '#ccc'
                        // ...
                        }
            },
            series: [
                {
                name: '用户满意度',
                type: 'pie',
                radius: '50%',
                data: [
                    { value: 148, name: '不满意' },
                    { value: 735, name: '一般' },
                    { value: 580, name: '满意' },
                ],
                emphasis: {
                    itemStyle: {
                    shadowBlur: 10,
                    shadowOffsetX: 0,
                    shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
                }
            ]
        }  
        }
    },
    beforeDestroy() {
    
  },
    mounted(){

          this.init()

      },
      watch:{
        //监听有没有新的数据更新

      },
      methods:{
        init(){
          var mychart = echarts.init(this.$refs.mychart)
          this.option.series[0].data = this.serData
          mychart.setOption(this.option)
        }
      }
}
</script>

<style>

</style>